<template>
    <div class="article-list">
        <div class="article-list-card">
            <div class="member-list-head">

                <Row :gutter="5" style="margin-bottom: 10px">

                    <Col span="4">
                        <Input clearable v-model="searchData.userName" placeholder="用户名" type="text"></Input>
                    </Col>

                    <Col span="2">
                        <ButtonGroup class="subSearch">
                            <!--<Button @click="$router.push({name:'member-add-nocache'})" type="primary" icon="plus-round">新增</Button>-->
                            <Button :loading="search_loading" @click="searchGetList" type="primary">
                                <Icon type="ios-pulse-strong"></Icon>
                                筛 选
                            </Button>
                        </ButtonGroup>
                    </Col>
                </Row>
            </div>
            <i-table height="680" stripe :columns="columns" :data="data"></i-table>
            <div style="padding: 15px;">
                <Page @on-page-size-change="changeTiao" @on-change="changePage" :current="index" :total="total"
                      show-elevator show-sizer :placement="'top'" :page-size="page_con"
                      :page-size-opts="[10, 15, 20, 30, 40, 50]"></Page>
            </div>
        </div>
        <Modal v-model="modal2" width="360">
            <p slot="header" style="color:#f60;text-align:center">
                <Icon type="information-circled"></Icon>
                <span>删除确认</span>
            </p>
            <div style="text-align:center">
                <p>是否继续删除？</p>
            </div>
            <div slot="footer">
                <Button type="error" size="large" long :loading="modal_loading" @click="del">删除</Button>
            </div>
        </Modal>
        <Modal v-model="modal3" width="360">
            <p slot="header" style="color:#f60;text-align:center">
                <Icon type="information-circled"></Icon>
                <span>显示确认</span>
            </p>
            <div style="text-align:center">
                <p>是否确认显示？</p>
            </div>
            <div slot="footer">
                <Button type="error" size="large" long :loading="modal_loading" @click="shownow">显示</Button>
            </div>
        </Modal>
    </div>
</template>
<script>
    export default {
        name: "money-list",
        data() {
            return {
                searchData: {
                    timeStartEnd: [],//两个时间内的赛选
                    loginName: "",//
                    userName: "",
                    userPhone: "",//
                    userType: "",
                    sort: "",
                    userStatus: "",
                    svip: "",
                    is_daili: "",
                    uid: '',
                    email: '',
                    userLevel: '',
                    sz_type: '',
                    money_type_name: '',
                    type_name: ''

                },
                columns: [
                    {
                        title: '序号',
                        type: 'index',
                        width: 60,
                        align: "center",
                    },
                    {
                        title: '用户名',
                        key: 'username',
                        align: "center",
                    },
                    {
                        title: '操作内容',
                        key: 'content',
                        align: "center",
                    },
                    {
                        title: '操作时间',
                        key: 'dotime',
                        align: "center",
                        render: (h, params) => {
                            return this.timeFormat(params.row.dotime)
                        }
                    },
                    {
                        title: 'ip',
                        key: 'ip',
                        align: "center",
                    },
                    // {
                    //     title: '操作',
                    //     key: 'action',
                    //     align: 'center',
                    //     width: 250,
                    //     render: (h, params) => {
                    //         return h('ButtonGroup', [
                    //             h('Button', {
                    //                 props: {
                    //                     type: 'warning',
                    //                 },
                    //                 on: {
                    //                     click: () => {
                    //                         this.tiao(params.index)
                    //                     }
                    //                 }
                    //             },"修改"),
                    //             h('Button', {
                    //                 props: {
                    //                     type: 'error',
                    //                 },
                    //                 on: {
                    //                     click: () => {
                    //                         this.show(params.index)
                    //                     }
                    //                 }
                    //             }, '显示'),
                    //             h('Button', {
                    //                 props: {
                    //                     type: 'error',
                    //                 },
                    //                 on: {
                    //                     click: () => {
                    //                         this.remove(params.index)
                    //                     }
                    //                 }
                    //             }, '删除')
                    //         ]);
                    //     }
                    // },
                ],
                data: [],
                total: 0,
                index: 1,
                page_con: 15,
                modal2: false,
                modal3: false,
                search_loading: false,
                doIndex: 0,//操作的下标
                modal_loading: false,
                type_name: {},
                sz_type: {},
                money_type_name: {},

            }
        },
        activated() {
            this.getArticleList()
        },
        methods: {
            getArticleList() {
                this.getJsonData("Log/getOperationLog", {
                    phone: this.searchData.userPhone,
                    username: this.searchData.userName,
                    num:this.page_con,
                    page:this.index,
                })
                    .then((res) => {
                        // var arr = []
                        // var finArr = res.finances
                        // for (let i in finArr) {
                        //     let o = {};
                        //     o[i] = finArr[i];
                        //     arr.push(o)
                        //     console.log(arr)
                        // }
                        // this.data = arr
                        this.data = res.data
                        this.type_name = res.type_name
                        this.money_type_name = res.money_type_name
                        this.sz_type = res.sz_type_name
                        this.total = parseInt(res.count)
                        this.search_loading = false
                    }).catch((res) => {
                    this.search_loading = false
                })
            },
            changePage(n) {
                this.index = n
                this.getArticleList()
            },
            changeTiao(num) {
                this.page_con = num
                this.index = 1
                this.getArticleList()
            },
            searchGetList() {
                this.search_loading = true
                this.index = 1
                this.getArticleList()
            },
            remove(n) {
                this.doIndex = n
                this.modal2 = true
            },
            show(n) {
                this.doIndex = n
                this.modal3 = true
            },
            del() {
                this.modal_loading = true;
                this.getJsonData("Art/deleteArt", {id: this.data[this.doIndex].id}, true)
                    .then((res) => {
                        this.getArticleList()
                        this.modal_loading = false;
                        this.modal2 = false;
                        this.$Message.success('删除成功');
                    }).catch((res) => {
                    this.modal_loading = false;
                    this.modal2 = false;
                })
            },
            shownow() {
                this.modal_loading = true;
                this.getJsonData("Art/runArtStatus", {id: this.data[this.doIndex].id}, true)
                    .then((res) => {
                        this.getArticleList()
                        this.modal_loading = false;
                        this.modal3 = false;
                        this.$Message.success('操作成功');
                    }).catch((res) => {
                    this.modal_loading = false;
                    this.modal3 = false;
                })
            },
            tiao(n) {
                this.$router.push({name: "article-add-nosave", query: {isEdit: true, id: this.data[n].id, type: 2}})
            },
        }
    }
</script>
<style lang="less">
    @import "./operate-list";
</style>